<!--
 * @Author: wuyang
 * @Description: 
 * @Date: 2023-01-07 19:39:50
 * @LastEditors: wuyang
 * @LastEditTime: 2023-01-07 19:40:07
 * @FilePath: \vue3-graduate\src\views\personalCenter\index.vue
-->
<template>
  <div class="person-container">
    <div class="person-info main-box">
      <PersonInfo />
    </div>
    <div class="person-operate main-box">
      <PersonOperate />
    </div>
  </div>
</template>

<script setup lang="ts">
import PersonInfo from './personInfo/index.vue'
import PersonOperate from './personOperate/index.vue'
</script>

<style scoped lang="scss">
.person-container {
  height: 100%;
  display: grid;
  grid-template-columns: 1fr 3fr;
  grid-template-rows: 1fr;
  gap: 0 2rem;

  .main-box {
    background-color: #fff;
    padding: 2rem;
  }

  .person-info {
    background-color: #fff;
  }

  .person-operate {
    background-color: #fff;
  }
}
</style>
